<%layout("/common/layout.html"){%>

<div class="container wrap-content center-block">
    <div class="head">
        <div class="row">
            <div class="col-md-12 wrap-slide">
                <div class="id-slide" id="slide">
                    <ul>
                        <li>
                            <a href="singleT.html">
                                <img src="images/tt/tt5.jpg"></a>
                        </li>
                        <li>
                            <a href="singleT.html">
                                <img src="images/tt/tt1.jpg"></a>
                        </li>
                        <li>
                            <a href="singleT.html">
                                <img src="images/tt/tt2.jpg"></a>
                        </li>
                        <li>
                            <a href="singleT.html">
                                <img src="images/tt/tt3.jpg"></a>
                        </li>
                        <li>
                            <a href="singleT.html">
                                <img src="images/tt/tt4.jpg"></a>
                        </li>
                        <li>
                            <a href="singleT.html">
                                <img src="images/tt/tt5.jpg"></a>
                        </li>
                        <li>
                            <a href="singleT.html">
                                <img src="images/tt/tt1.jpg"></a>
                        </li>
                    </ul>
                </div>
                <ul class="id-dir">
                    <li class="pull-left">
                        <a href="javascript:void(0)">
                            <span class="id-prev"></span>
                        </a>
                    </li>
                    <li class="pull-right">
                        <a href="javascript:void(0)">
                            <span class="id-next"></span>
                        </a>
                    </li>
                </ul>
                <div class="slidebar">
                    <ul class="id-slide-num" id="slide-num">
                        <li>
                            <span class="id-num id-cur">
                                <span class="id-page">1</span>
                            </span>
                        </li>
                        <li>
                            <span class="id-num">
                                <span class="id-page">2</span>
                            </span>
                        </li>
                        <li>
                            <span class="id-num">
                                <span class="id-page">3</span>
                            </span>
                        </li>
                        <li>
                            <span class="id-num">
                                <span class="id-page">4</span>
                            </span>
                        </li>
                        <li>
                            <span class="id-num">
                                <span class="id-page">5</span>
                            </span>
                        </li>
                    </ul>
                </div>
            </div>
        </div>
    </div>
    <div class="row classic section">
        <p class="ind-colum-title">最热设计</p>
        <a href="${ctxPath}/design/listByHot" class="btn btn-info ind-more">more</a>

        <div class="ind-column-wrap">


            <%for(design0 in hotList){%>

            <div class="col-md-3 cla-content">
                <div class="new-img">
                    <a href="${ctxPath}/design?design=${design0.id}">
                        <img src="${design0.img}" alt=""></a>
                </div>
                <div class="description">
                    <p class="new-title">${design0.name}</p>

                    <p class="new-data">
                        <span>${design0.count}个</span>
                        购买
                    </p>
                </div>
                <div class="center-block ind-top">
                    <a href="${ctxPath}/design/info?design=${design0.id}" class="btn btn-danger buy">
                        <span class="glyphicon glyphicon-shopping-cart" aria-hidden="true"></span>
                        购买
                    </a>
                    <a href="" class="btn btn-default new-comment" aria-label="Left Align">
                        <span class="glyphicon glyphicon-comment" aria-hidden="true"></span>
                    </a>
                    <button type="button" href="" class="btn btn-default vote" aria-label="Left Align">
                        <span class="glyphicon glyphicon-star-empty vot" aria-hidden="true"></span>
                    </button>
                </div>
            </div>

            <%}%>

        </div>
    </div>
    <div class="row theme section">
        <p class="ind-colum-title">最新设计</p>

        <a href="${ctxPath}/design/listByNew" class="btn btn-info ind-more">more</a>

        <div class="ind-column-wrap">

            <%for(design1 in newList){%>
            <div class="col-md-3 theme-content co-theme">
                <a href="${ctxPath}/design?design=${design1.id}">
                    <img src="${design1.img}" alt="" class="theme-img"></a>

                <p class="co-themeName">${design1.name}</p>

                <p class="co-themeDesc">${design1.name}</p>
            </div>
            <%}%>

        </div>
    </div>
    <div class="row daren section">
        <p class="ind-colum-title">设计达人</p>

        <div class="ind-column-wrap">

            <%for(user0 in hotUser){%>
            <div class="col-md-3 daren-content">
                <div class="daren-img">
                    <a href="${ctxPath}/user/userInfo?user=${user0.id}" class="bg">
                        <img src="${ctxPath}/images/bg.jpg" alt=""></a>
                    <a href="${ctxPath}/user/userInfo?user=${user0.id}" class="avatar">
                        <img src="${user0.img}" alt=""></a>
                </div>
                <div class="daren-desc">
                    <a href="${ctxPath}/user/userInfo?user=${user0.id}" class="daren-title">${user0.name}</a>

                    <p class="daren-expertise">
                        发布： <b>${user0.count}</b>
                    </p>
                </div>
            </div>
            <%}%>
        </div>
    </div>

    <div class="row material section">
        <p class="ind-colum-title">设计素材</p>
        <a href="${ctxPath}/img/listAll" class="btn btn-info ind-more">more</a>

        <div class="ind-column-wrap">
            <%for(image in hotImages){%>
            <div class="col-md-3 met-content">
                <a href="#" class="thumbnail">
                    <img src="${image.img}" alt="...">
                </a>
            </div>
            <%}%>
        </div>
    </div>
</div>


<%include("/common/footer.html"){}%>

<script src="${ctxPath}/js/jquery-2.1.1.min.js"></script>
<script src="${ctxPath}/js/bootstrap.min.js"></script>
<script src="${ctxPath}/js/slideShow.js"></script>
<script src="${ctxPath}/js/index.js"></script>
<script src="${ctxPath}/js/nav.js"></script>

<%}%>